<!-- 请复制整个jsp，修改下面第三行引用的js即可 -->
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/metals/purchase/purchase_request_add.js"></script>
<style type="text/css">
.td {
	width: 8%;
	overflow: hidden;
	height: 15%;
	text-align: center
}

.form-control {
	position: abslute;
	top: 20%;
	right: 20%;
	float: right"
}

.input-text {
	width: 100%;
	height: 100%
}

</style>
<script type="text/javascript">
$(function() {
	$("#bid").on("click", function(e) {
		console.log("asd");
	});
});	
var i = 0;
function insert_row(obj) {
	i++;
	R = tbl.insertRow(tbl.rows.length);
	C = R.insertCell(0);
	C.innerHTML = '<input type="text"  class="form-control" name="id" id="item_no_1_">';
	C = R.insertCell(1);
	C.innerHTML = '<select name="suppNumber" id="suppNumberid" class="form-control supplierfille" ><option>选择</option><c:forEach var="key" items="${suppfille }"><option value="${key.suppNumber }">${key.suppName }</option></c:forEach></select>';
	C = R.insertCell(2);
	C.innerHTML = '<select name="bomid" id="bomid" class="form-control metalsbom" ><option>选择</option><c:forEach var="key" items="${metalsbom }"><option value="${key.id }">${key.name }</option></c:forEach></select>';
	C = R.insertCell(3);
	C.innerHTML = '<input type="text" class="form-control" name="name" id="item_balance_up_1">'; 
	C = R.insertCell(4);
	C.innerHTML = '<input type="text" class="form-control" name="specifications" id="item_balance_down_1">';
	C = R.insertCell(5);
	C.innerHTML = '<input type="text" class="form-control" name="unit" id="item_balance_down_1">';
	C = R.insertCell(6);
	C.innerHTML = '<input type="text" class="form-control" name="number" id="item_balance_down_1">';
	C = R.insertCell(7);
	C.innerHTML = '<input type="text" class="form-control" name="price" id="item_balance_down_1">';
	C = R.insertCell(8);
	C.innerHTML = '<input type="text" class="form-control" name="total" id="item_balance_down_1">';
	C = R.insertCell(9);
	C.innerHTML = '<input type="text" class="form-control" name="inventoryTotal" id="item_balance_down_1">';
	C = R.insertCell(10);
	C.innerHTML = '<input type="text" class="form-control" name="comment" id="item_balance_down_1">';
	C = R.insertCell(11);
	C.innerHTML = '<input type="button" class="btn btn-danger" onclick ="deleteRow(this)" value ="删除">';
	
	$(".metalsbom").change(function(){
		var id=$(this).val();
		var that=$(this);				
		$.getJSON(rootPath+"/purchase/metalsbom_choose.shtml","id="+id,function(data){
					that.parent().next().find("input").val(data.name);
					that.parent().next().next().find("input").val(data.specifications);
					that.parent().next().next().next().find("input").val(data.unit); 
					that.parent().next().next().next().next().next().next().next().find("input").val(data.inventoryTotal); 
		});
	});
	
	$(".supplierfille").change(function(){
		var id=$(this).val();
		var that=$(this);				
		$.getJSON(rootPath+"/purchase/metalsbom.shtml","id="+id,function(data){
			that.parent().parent().find(".metalsbom").html("");
			that.parent().parent().find(".metalsbom").append("<option value='' >选择</option>")
			$.each(data, function(i, item){
				that.parent().parent().find(".metalsbom").append("<option value='"+item.id+"' >"+item.materialCode+"</option>")
			})
		});
	});
}

function deleteRow(obj) {
	var i = obj.parentNode.parentNode.rowIndex;
	if (i >= 3) {
		tbl.deleteRow(i-3);
	}
}
</script>
<body>
<div style='width: 100%;height:300px'>
		<form id="form" name="form" class="form-horizontal" method="post"
			action="${pageContext.request.contextPath}/purchase/purchase_addrequest.shtml" >
			<section class="panel panel-default">
			<select style="width: 10%;" class="form-control" name="flow" >
							<option value=" ">选择流程</option>
							<option value="0">常规流程</option>
							<option value="1">特殊流程</option>
			</select>
			<th style="text-align: center;"><input type="button"
									class="btn btn-primary" onclick="insert_row(this)" value="增加"></th>
			<table border="1" style="margin: 0 auto;">
				<tr class="tr ">
					<td class="td">申请部门</td>
					<td class="td">
						<div style="width: 100%">
							<select style="width: 90%;" class="form-control"
								name="departmentId">
								<option value=" ">选择</option>
								<c:forEach var="key" items="${department }">
									<option value="${key.id }">${key.name }</option>
								</c:forEach>
							</select>
						</div>
					</td>
					<td class="td">采购单号</td>
					<td class="td"><input type="text" class="input-text"
						name="buyId" value=""></td>
					<td class="td">日期</td>
					<td class="td"></td>
					<td class="td"></td>
					<td class="td"></td>
					<td class="td"></td>
					<td class="td"></td>
					<td class="td"></td>
					<td class="td"></td>
				</tr>
				<tr>
					<td class="td">序号</td>
					<td class="td">供应商</td>
					<td class="td">物料编码</td>
					<td class="td">名称</td>
					<td class="td">规格型号</td>
					<td class="td">单位</td>
					<td class="td">数量</td>
					<td class="td">单价</td>
					<td class="td">总价(元)</td>
					<td class="td">零配件现有库存量</td>
					<td class="td" colspan="2">备注</td>
				</tr>
				<tr>
					<tbody id="tbl">

					</tbody>
				</tr>
				<tr>
					<td class="td"></td>
					<td class="td"></td>
					<td class="td"></td>
					<td class="td"></td>
					<td class="td"></td>
					<td class="td">申请人</td>
					<td class="td">仓管员</td>
					<td class="td">采购员</td>
					<td class="td">设备主管</td>
					<td class="td">生产副总</td>
					<td class="td">财务部</td>
					<td class="td">总经理</td>
				</tr>
				<tr>
					<td class="td">&nbsp;</td>
					<td class="td"></td>
					<td class="td"></td>
					<td class="td"></td>
					<td class="td"></td>
					<td class="td"></td>
					<td class="td"></td>
					<td class="td"></td>
					<td class="td"></td>
					<td class="td"></td>
					<td class="td"></td>
					<td class="td"></td>
				</tr>
				<tr>
					<td class="td"></td>
					<td class="td"></td>
					<td class="td"></td>
					<td class="td"></td>
					<td class="td"></td>
					<td class="td">日期</td>
					<td class="td">日期</td>
					<td class="td">日期</td>
					<td class="td">日期</td>
					<td class="td">日期</td>
					<td class="td">日期</td>
					<td class="td">日期</td>
				</tr>
				<tr>
					<td class="td"></td>
					<td class="td">&nbsp;</td>
					<td class="td"></td>
					<td class="td"></td>
					<td class="td"></td>
					<td class="td"></td>
					<td class="td"></td>
					<td class="td"></td>
					<td class="td"></td>
					<td class="td"></td>
					<td class="td"></td>
					<td class="td"></td>
				</tr>
			</table>
			<footer class="panel-footer text-right bg-light lter">
				<button type="submit" class="btn btn-success btn-s-xs">提交</button>
			</footer>
			</section>
		</form>
	</div>
</body>